<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8"/>
  <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
  <meta http-equiv="X-UA-Compatible" content="ie=edge"/>
  <title>IT服务</title>
  <link rel="shortcut icon" href="favicon.jpg"/>
  <link rel="stylesheet" href="3rd/element-ui@2.13.2/lib/theme-chalk/index.css"/>
  <link rel="stylesheet" href="css/app.css"/>
  <link rel="stylesheet" href="css/reset.css"/>
  <style>
  </style>
</head>
<body>
<div id="app" v-cloak>
  <el-container>
    <el-main>

      <el-card class="box-card" >
        <div slot="header" class="clearfix">
          <span class="el-icon-warning-outline" style="color: #ff4d51"></span>
          问题类型：{{onePro.subject}}
        </div>
        <div class="detail">
          <p class="el-icon-user-solid" style="color: #409EFF"></p>
          申报人：{{ onePro.createName }}
          <br/><br/>
          <p class="el-icon-tickets" style="color: #e6a23c"></p>
          内容：{{ onePro.content }}<br/><br/>
          <p class="el-icon-user-solid" style="color: #409EFF"></p>
          提出人：{{ onePro.proposer }}
          <br/><br/>

          <div v-if="!onePro.respaName">
          </div>
          <div v-else>
            <p class="el-icon-s-custom" style="color: #b3e19d"></p>
            处理工程师：{{ onePro.respaName }}
          </div>
        </div>
      </el-card>
      <br/>
      <div v-if="onePro.fileList">
        <li v-for="(item, index) in onePro.fileList" :key="index">
          <el-link :href="'image/image/'+item" target="_blank">{{ item }}</el-link>
        </li>
        <br/>
      </div>
      <div v-if="!onePro.questionPhoto">
      </div>
      <div v-else>

        <el-image
                style="width: 300px; height: 300px"
                :src="'image/image/'+onePro.questionPhoto"
                :preview-src-list="['image/image/'+onePro.questionPhoto]">
        </el-image>
        <br/>
<!--        <img slot="reference" :src="'image/image/'+onePro.questionPhoto" style="width: 300px;height: 300px">-->
      </div>

      <div v-if="!onePro.oktime">
      </div>
      <div v-else>
        <el-card class="box-card" >
          <div slot="header" class="clearfix">
            <span class="el-icon-s-opportunity" style="color: blueviolet"></span>
            解决方案
          </div>
          <div v-if="!onePro.remark">
            无
          </div>
          <div v-else>
            <div class="detail">
              {{ onePro.remark }}
            </div>
          </div>
        </el-card>
        <br/>
        <div v-if="!onePro.score">
          <div class="block">
            <el-rate v-model="rate" show-text="true"  :texts="text" @change="changeValue"></el-rate>
          </div>
          <br/>
          <el-input
                  type="textarea"
                  :rows="2"
                  placeholder="您的评价是我们服务的动力"
                  v-model="rateRemark">
          </el-input>
          <br/><br/>
          <el-button type="primary" @click="submitOnePro">立即评价</el-button>
        </div>
        <div v-else>
          <el-card class="box-card" >
            <div slot="header" class="clearfix">
              <span class="el-icon-star-off" style="color: #83e22b"></span>
              我的评价
            </div>
            <div class="detail">
              <el-rate v-model="onePro.score" disabled></el-rate>
              <br/>
              {{ onePro.rateRemark }}
            </div>
          </el-card>
        </div>
        <br/>
      </div>


      <div v-if="onePro.questionType==2||onePro.questionType==4">
        <el-card class="box-card" >
          <div slot="header" class="clearfix">
            审批流程
          </div>
          <div class="detail">
            <div class="block">
              <el-timeline>
                <el-timeline-item :timestamp = "approve1.subTime" color="#409EFF" icon="el-icon-check" >
                  <h4>{{approve1.name}}</h4>
                  <p>提交了工单</p>
                </el-timeline-item>

                <el-timeline-item :timestamp= "approve1.approveTime" color="#409EFF" :icon="geticon(approve1.status)" >
                  <h4>{{approve1.approver}}</h4>
                  <div v-if ="approve1.approveTime&&approve1.status==1">
                    <p>审批通过</p>
                  </div>
                  <div v-if ="approve1.approveTime&&approve1.status==2">
                    <p>退回</p>
                  </div>
                </el-timeline-item>


                <el-timeline-item :timestamp= "approve2.approveTime" color="#409EFF" :icon="geticon(approve2.status)" >
                  <h4>{{approve2.approver}}</h4>
                  <div v-if ="approve2.approveTime&&approve2.status==1">
                    <p>审批通过</p>
                  </div>
                  <div v-if ="approve2.approveTime&&approve2.status==2">
                    <p>退回</p>
                  </div>

                </el-timeline-item>

                <div v-if="!approve3">
                </div>
                <div v-else>
                  <el-timeline-item :timestamp= "approve3.approveTime" color="#409EFF" :icon="geticon(approve3.status)" >

                    <div v-if ="approve3.approveTime&&approve3.status==1">
                      <h4>{{approve3.approver}}</h4>
                      <p>审批通过</p>
                    </div>

                    <div v-if ="approve3.approveTime&&approve3.status==2">
                      <p>退回</p>
                    </div>
                    <div v-if="!approve3.approveTime">
                      <p>IT主管</p>
                    </div>

                  </el-timeline-item>
                </div>

              </el-timeline>
            </div>
          </div>
        </el-card>
        <br/>
      </div>

      <el-card class="box-card" >
        <div slot="header" class="clearfix">
          问题处理记录
        </div>
        <div class="detail">
          <div class="block">
            <el-timeline>
              <el-timeline-item :timestamp = "onePro.ctime" color="#409EFF" icon="el-icon-check" >
                  <h4>{{onePro.createName}}</h4>
                  <p>提交了工单</p>
              </el-timeline-item>
              <div v-if ="onePro.respaName&&onePro.acceptTime">
                <el-timeline-item :timestamp= "onePro.acceptTime" color="#409EFF" icon="el-icon-check" >
                  <h4>{{onePro.respaName}}</h4>
                  <p>接受了工单</p>
                </el-timeline-item>
                <div v-if ="onePro.respaName&&onePro.oktime">
                  <el-timeline-item :timestamp= "onePro.oktime" color="#409EFF" icon="el-icon-check" >
                    <h4>{{onePro.respaName}}</h4>
                    <p>完成了工单</p>
                  </el-timeline-item>
                </div>
              </div>

            </el-timeline>
          </div>
        </div>
      </el-card>
<!--      <br/>-->

<!--      <el-button type="primary" @click="oneBack">返回</el-button>-->

    </el-main>
  </el-container>




</div>
<script src="3rd/polyfill.min.js"></script>
<script src="3rd/vue.min.js"></script>
<script src="3rd/element-ui@2.13.2/lib/index.js"></script>
<script src="3rd/axios.min.js"></script>
<script src="js/util.js"></script>
<script src="js/process.js"></script>
</body>
</html>
